<template>
	<view>
		<cu-custom bgColor="bg-gradual-green" :isBack="true">
			<block slot="content">订单确认</block>
		</cu-custom>
		
		
		<scroll-view scroll-y="true">
			<view style="padding-top: 20upx; padding-bottom: 200upx;">
				<view class="goodsInfoArea shadow">
					<view class="goodsLabel bg-olive">
						<view>
							<text class="cuIcon-cartfill text-lg" style="margin-left: 10upx;margin-right: 10upx; font-size: 18px;"></text>
							<text style="font-size: 18px;">商品信息</text>
						</view>
						<view style="margin-right: 15upx; margin-top: 10upx;" v-if="goods.goodsIsHelper == 1">
							<text style="font-size: 12px; margin-top: 15upx;">扶贫商品</text>
						</view>
					</view>
				
					<view class="goodsInfo">
						<view class="goodsImg">
							<image :src="goods.goodsImg" mode="aspectFill" style="width: 300upx; height: 200upx; border-radius: 20upx;"></image>
						</view>
						<view class="goodsInfoLabel">
							<view class="goodsName">{{goods.goodsName}}</view>
							<view class="goodsCount">
								<text>购买数量：</text>
								<yp-number-box :min="1" :max="100" @change="orderBuyCountHandler" v-model="order.orderBuyCount"></yp-number-box>
							</view>
							<view class="goodsPrice">
								<text style="font-size: 15px;">单价：</text>
								<text class=" text-price text-red" style="font-size: 15px;">
									{{goods.goodsIsPromote == 1 ? goods.goodsPromotePrice : goods.goodsPrice}}
								</text>
				
							</view>
						</view>
					</view>
				</view>
				
				<view class="customerInfoArea">
					<view class="customerLabel bg-olive">
						<text class="cuIcon-deliver_fill" style="margin-left: 10upx;margin-right: 10upx; font-size: 18px;"></text>
						<text>配送信息</text>
					</view>
				
					<view class="customerInfo">
						<view class="cu-form-group">
							<view class="title">姓名：</view>
							<input placeholder="收货人姓名" name="input" :value="user.userRealName"></input>
						</view>
						<view class="cu-form-group">
							<view class="title">手机号：</view>
							<input placeholder="联系电话" name="input" :value="user.userPhoneCall"></input>
						</view>
						<view class="cu-form-group">
							<view class="title">配送点：</view>
							<input placeholder="取物地点" name="input" :value="user.userAddress" disabled="true"></input>
						</view>
					</view>
				
				</view>
				
				<view class="scoreArea">
					<view class="customerLabel bg-olive">
						<text class="cuIcon-presentfill" style="margin-left: 10upx;margin-right: 10upx; font-size: 18px;"></text>
						<text>扶贫积分</text>
					</view>
					<view class="customerContent">
						<view class="cu-form-group" v-if="goods.goodsIsUseScore == 1">
							<view class="title">是否使用扶贫积分</view>
							<switch @change="useScoreHandler" :class="useScore?'checked':''" :checked="useScore?true:false"></switch>
						</view>
						<view class="cu-form-group" v-if="useScore">
							<view class="title">使用数量：</view>
							<input placeholder="最多可以使用200积分" name="input" type="number" :disabled="!useScore" :value="useScoreCount" @blur="useScoreCountHandler"></input>
						</view>
						<view class="cu-form-group" v-if="goods.goodsIsBackScore == 1">
							订单确认收货后，您可获得
								<text style="color: green;font-size: 22px;">{{backScore}}</text>
							扶贫积分
						</view>
					</view>
				</view>
			</view>
		</scroll-view>

		<view class="bottomBar">
			<view class="bottomPrice basis-lg bg-white">
				<view class="price" style="margin-left: 20upx; margin-top: 8upx;">
					<view class="totalPrice">
						<text style="font-size: 16px; color: black;">合计：</text>
						<text class="text-price" style="color: red;font-size: 16px;">{{order.orderTotalFee}} </text>
					</view>
					<view class="discountPrice" style="color:#808080; font-size: 14px;">
						<text>总额：￥{{originPrice}}</text>
						<text style="margin-left: 15upx;">优惠：￥{{discountPrice}}</text>
					</view>
				</view>
			</view>
			<view class="bottomPay basis-sm bg-green" 
			style="text-align: center; padding-top: 25upx; font-size: 18px;"
			hover-class="navigator-hover" @click="submitOrder"
			>
				<text class="cuIcon-card" style="margin-right: 10upx;"></text>
				去支付
			</view>
		</view>
		

		

	</view>
</template>

<script>
	import ypNumberBox from "@/components/yp-number-box.vue"
	import { getGoodsInfoById } from '../../api/goodsAPI.js'
	import { createOrder } from '../../api/orderAPI.js'
	export default {
		components: {
			ypNumberBox
		},
		data() {
			return {
				goods: {
					// goodsName: "阜平花山香菇干200g 珍珠菇 蘑菇 菌菇 无根 南北山珍干货 煲汤红烧蒸蛋",
					// goodsPrice: 18.8,
					// goodsIsPromote: 1,
					// goodsPromotePrice: 8.88,
					// goodsImg: "http://www.2306.tech/CCShop/images/goods/FA0257/FA0257-0.jpg",
					// goodsIsBackScore: 1,
					// goodsBackScoreAccount: 188,
					// goodsIsUseScore: 1,
					// goodsUseScoreMax: 200,
					// goodsType: "1",
					// goodsIsHelper: 1,
					// goodsLowerLimit: 1,
				},
				user: {
					
					// "userSex": 1,
					// "userPassword": "",
					// "userStatus": 1,
					// "userOpenid": "o6E-Q4nzCUe_s7XssEiuJKbpUyZM",
					// "userRealName": "李炎昊",
					// "userScore": 0,
					// "userId": "o6E-Q4nzCUe_s7XssEiuJKbpUyZM",
					// "userRegisterTime": {
					//     "date": 3,
					//     "hours": 0,
					//     "seconds": 0,
					//     "month": 5,
					//     "timezoneOffset": -480,
					//     "year": 119,
					//     "minutes": 0,
					//     "time": 1559491200000,
					//     "day": 1
					// },
					// "userAddress": "北京城市学院",
					// "userPhoneCall": "18501994241",
					// "userRegisterIp": "",
					// "userEmail": "954050674@qq.com",
					// "userLastLoginIp": "",
					// "userLastLoginTime": null,
					// "userNickName": "",
					// "userType": 1,
					// "userBirthday": "199912033831"
									
				},
				order:{
					orderConsignee:"",
					orderTel:"",
					orderGoodsId:"",
					orderOutletsId:"",
					orderTotalFee:"",
					orderBuyCount:1,
					orderScore:""
				},
				useScore: false,
				useScoreCount:"",
				backScore:0,
				originPrice:0,
				discountPrice:0
			}
		},
		onLoad(params) {
			let goodsId = params.id;
			if(goodsId == null) {
				goodsId = "FA0257"
			}
			const app = getApp()
			getGoodsInfoById(goodsId).then(resp=>{
				console.warn(resp)
				this.goods = resp;
				this.goods.goodsImg = app.globalData.serverUrl + 'images/goods/'+goodsId+'/'+goodsId+'-0.jpg'
				this.order.orderBuyCount = 1;
				this.backScore = this.goods.goodsBackScoreAccount 
				this.orderTotalFeeCompute()
				this.orderOriginFeeCompute()
				this.orderDiscountFeeCompute()
			})
			this.user = app.globalData.user
		},
		methods: {
			useScoreHandler(e) {
				console.log(e)
				this.useScore = e.detail.value
				if (e.detail.value == false) {
					this.useScoreCount = 0
					this.orderTotalFeeCompute()
					this.orderOriginFeeCompute()
					this.orderDiscountFeeCompute()
				}
				
			},
			orderScoreCompute(count) {
				this.backScore = this.goods.goodsBackScoreAccount * this.order.orderBuyCount
			},
			orderBuyCountHandler(value) {
				if(value < 1 || value > 100) {
					uni.showToast({
						title:"输入的购买数量不合法！",
						icon:'none'
					})
					value = 1
				}
				
				this.order.orderBuyCount = value
				this.orderScoreCompute(value)
				this.orderTotalFeeCompute()
				this.orderOriginFeeCompute()
				this.orderDiscountFeeCompute()
			},
			useScoreCountHandler(event) {
				console.log(event)
				let count = event.detail.value
				if(this.goods.goodsUseScoreMax < count) {
					uni.showToast({
						icon:'none',
						title:'使用积分超过最大限制'
					})
					count = 0
				}
				
				this.useScoreCount = count
				this.orderTotalFeeCompute()
				this.orderOriginFeeCompute()
				this.orderDiscountFeeCompute()
				
			},
			orderTotalFeeCompute() {
				let singlePrice = this.goods.goodsIsPromote ? this.goods.goodsPromotePrice : this.goods.goodsPrice;
				let count = this.order.orderBuyCount;
				let useScore = this.useScoreCount;
				let scoreDiscount = useScore * 0.01;
				console.log(singlePrice + "*" + count + "-" + scoreDiscount + "=" + (singlePrice * count - scoreDiscount))
				let num = singlePrice * count - scoreDiscount
				this.order.orderTotalFee = num.toFixed(2)
				return singlePrice * count - scoreDiscount;
			},
			orderOriginFeeCompute() {
				let singlePrice = this.goods.goodsPrice;
				let count = this.order.orderBuyCount;
				this.originPrice = (singlePrice * count).toFixed(2)
			},
			orderDiscountFeeCompute() {
				let singlePrice = this.goods.goodsPrice;
				let promotePrice = this.goods.goodsIsPromote ? this.goods.goodsPromotePrice : this.goods.goodsPrice;
				let count = this.order.orderBuyCount;
				let minus = singlePrice - promotePrice;
				let scoreDiscount = this.useScoreCount * 0.01;
				this.discountPrice = (minus * count + scoreDiscount).toFixed(2)
			},
			submitOrder() {
				uni.showToast({
					title: '正在创建订单',
					icon:'loading'
				});
				const order = {
					orderGoodsId:this.goods.goodsId,
					orderUserId:this.user.userId,
					orderOpenId:this.user.userOpenid,
					orderBatchId:this.goods.goods,
					orderOutletsId:'1001',
					orderConsignee:this.user.userRealName,
					orderTel:this.user.userPhoneCall,
					orderBuyCount:this.order.orderBuyCount,
					orderTotalFee:this.order.orderTotalFee,
					orderScore:this.goods.goodsIsBackScore == 1 ? this.backScore : 0 - this.useScoreCount
				}
				console.log('current order',order)
				createOrder(order).then(resp =>{
					console.log("resp: ",resp);
					if("success" == resp.result) {
						console.log('下单成功')
						let orderId = resp.orderId;
						uni.hideLoading()
						uni.navigateTo({
							url:'../pay/pay?type=1&id='+orderId
						})
					}
				}).catch(error =>{
					uni.hideLoading()
					uni.showModal({
						title:'提示',
						content:'服务器繁忙，请稍后再试',
						showCancel:false,
					})
				})
				console.log(order)
				
			}
			
			
			
			
		}
	}
</script>

<style>
	@import url("./goodsOrderInput.css");
</style>
